<template>
	<!-- 20230224 -->
	<view class="mall-my-order-refund-list-page">
		<!-- 页面内容 -->
		<view class="page-content padding-bottom-safe-20">

			<!-- 退款列表 -->
			<view class="margin-top-20">
				<ty-list-list :status="loadStatus">
					<view class="item margin-lr-30 margin-tb-20 radius-10 padding-lr-20 padding-top-10 padding-bottom-20 bg-ff"
						v-for="(item,index) in list" :key="index">
						
						<!-- 退款编号和状态 -->
						<view class="line-height-60 flex align-center justify-between">
							<view>
								<text class="tyIcon-list-1 text-30 text-4d"></text>
								<text class="text-24 text-4d">{{item.refund_order_number}}</text>
							</view>
							<view class="text-26 text-main">{{item.status_text}}</view>
						</view>

						<!-- 订单产品 -->
						<view class="padding-bottom-10" @click="go('/pages/mall/my/refundDetail?id=' + item.id)">
							<jc-mall-orderProducts :list="[item]"></jc-mall-orderProducts>
						</view>
						
<!-- 						<view class="padding-bottom-30 dashed-bottom-ed">
							<view class="product_item flex align-center"
								@click="go('/pages/mall/my/refundDetail?id='+item.id)">
								<image class="jc-image-180 radius-10" :src="item.product_cover_img" mode="aspectFill">
								</image>
								<view class="margin-left-30 flex-one">
									<view class="line-height-35 text-24 text-cut-one">{{item.product_name}}</view>
									<view
										class="margin-top-20 line-30 height-60 inline-block text-cut-two text-22 text-80">
										{{item.product_sku_name}}
									</view>
									<view class="margin-top-25 flex align-center justify-between">
										<text class="text-30 text-bold"></text>
										<view class="text-24 text-4d">x{{item.refund_number}}</view>
									</view>
								</view>
							</view>
						</view> -->

						<!-- 价钱合计 -->
						<view class="dashed-top-ed">
							<view class="line-height-80 flex align-center justify-end">
								<view class="">
									<text class="text-26 text-77">退款金额：</text>
									<text class="text-28">¥{{item.refund_money}}</text>
								</view>
							</view>

							<view class="">
								<jc-mall-myRefundBtn :status="item.status" :refund-id="item.id" :index="index"
									open-type="1" @del="del"></jc-mall-myRefundBtn>
							</view>
						</view>
					</view>
				</ty-list-list>
			</view>
		</view>

		<!-- 页面浮层 -->
		<view class="page-layer">

		</view>
	</view>
</template>

<script>
	import mall from "../api/mall.js"
	export default {
		data() {
			return {
				loadStatus: '',
				// 列表数据
				list: []
			}
		},

		onLoad(options) {
			
		},

		onShow() {
			this.loadList(1)
		},

		onReachBottom() {
			this.loadList(0)
		},

		methods: {
			/**
			 * 删除记录
			 * @date 2023-02-24
			 */
			del(){
				this.loadList(1)
			},
			
			/**
			 * 获取我的退款记录
			 * @param {int} isFirstPage 是否首页 0--不是 1--是
			 * @date 2023-02-24
			 */
			loadList(isFirstPage) {
				mall.refund.listRefundOrder(this, isFirstPage)
			}
		}
	}
</script>

<style scoped>

</style>
